<?php
$jobseekerList = $data['data'];
$maxPage = $data['MaxPage'];
?>
<h1>Staff Manage</h1>
<div class="panel panel-default" style=" background-color: ghostwhite; ">
    <div class="panel-body">
        <form action="index.php?r=StaffManage/view" method="get" id="formSearch">
            <input type="hidden" name="r" value="<?= $_GET['r'] ?>">
            <div class="input">
                <!--<input class="span10" id="appendedInputButtons" type="text">-->
                <div class="span8">
                    <label class="control-label" for="inputKeyword"><b>Keyword:</b></label>
                    <input type="search" name="Keyword" id="inputKeyword" class="span12">
                </div>
                <div class="span4">
                    <label class="control-label" for="inputStaffID"><b>Staff ID:</b></label>
                    <input type="text" name="StaffID" id="inputStaffID" class="span12">
                </div>
            </div>
            <div>
                <div class="span12">
                    <label class="control-label" for="inputProvince"><b>Select location:</b></label>
                    <select class="span12" name="Province" id="inputProvince">
                        <option selected="selected" value="0"></option>
                        <?= GM::getOptionDropdownProvince('en') ?>
                    </select>
                </div>
            </div>
            <div class="text-center">
                <button class="btn btn-large btn-danger" type="button" id="btn-search"><i class="icon-search"></i> Search</button>
            </div>
        </form>
    </div>
</div>
<a href="index.php?r=StaffManage/Form" class="btn btn-primary pull-right">Add Staff</a>
<div class="table-responsive">
<table class="table table-striped table-hover tablestaff">
    <thead>
        <tr>
            <th>#</th>
            <th>JobID</th>
            <th>Name</th>
            <th>Gender</th>
            <th>Expect Working Position</th>
            <th>Expect Location</th>
            <th>Register Date</th>
            <th>Enable</th>
            <th></th>
            <th></th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <?php
        if(empty($jobseekerList)){
            echo '<tr><td colspan="11">No Data ..</td></tr>';
        }
        $i = 0;
        foreach ($jobseekerList as $row) {
            $i++;
            ?>
            <tr data-id="<?= $row['StaffID'] ?>"
                data-staffname="<?= $row['StaffName'] ?>"
                data-gender="<?= $row['Gender'] == 'M' ? 'Male' : 'Female' ?>"
                data-nationality="<?= $row['Nationality'] ?>"
                data-dob="<?= $row['DOB'] ?>"
                data-address="<?= $row['Address'] ?>"
                data-provinceName="<?= $row['ProvinceName'] ?>"
                data-zipcode="<?= $row['ZipCode'] ?>"
                data-email="<?= $row['Email'] ?>"
                data-phone="<?= $row['Phone'] ?>"
                data-mobile="<?= $row['Mobile'] ?>"
                data-education="<?= JobSeeker::getEducationEN($row['Education']) ?>"
                data-institution="<?= $row['Institution'] ?>"
                data-major="<?= $row['Major'] ?>"
                data-enskill="<?= JobSeeker::getLanguageSkillEN($row['EnSkill']) ?>"
                data-jpskill="<?= JobSeeker::getLanguageSkillEN($row['JpSkill']) ?>"
                data-workposition="<?= $row['WorkPosition'] ?>"
                data-workexperiencedetail="<?= $row['WorkExperienceDetail'] ?>"
                data-expectworkingposition="<?= $row['ExpectWorkingPosition'] ?>"
                data-expectlocationname="<?= $row['ExpectLocationName'] ?>"
                data-expectsalary="<?= $row['ExpectSalary'] ?>"
                data-note="<?= $row['Note'] ?>"
                data-pagelanguage="<?= $row['PageLanguage'] ?>"
                data-jobid="<?= $row['JobID'] ?>">
                <td><?= $i + ($dataPerpage * ($page - 1)) ?></td>
                <td class="text-center"><?= $row['StaffID'] ?></td>
                <td><?= $row['StaffName'] ?></td>
                <td><?= $row['Gender'] == 'M' ? 'Male' : 'Female' ?></td>
                <td><?= $row['ExpectWorkingPosition'] ?></td>
                <td><?= $row['ExpectLocationName'] ?></td>
                <td><?= $row['CreateDate'] ?></td>
                <td class="col-status"><img src="images/<?= $row['ActiveStatus'] == 'P' ? 'accept.png' : 'disable.png' ?>" data-status="<?= $row['ActiveStatus'] ?>"></td>
                <td class="col-detail"><a href="#staffDetail" role="button" data-toggle="modal"><img src="images/page_white_magnify.png" title="Detail"></a></td>
                <td class="col-edit"><a href="index.php?r=StaffManage/Form&staffID=<?= $row['StaffID'] ?>"><img src="images/page_white_edit.png" title="Edit"></a></td>
                <td class="col-delete">
                    <form action="index.php?r=StaffManage/Delete" method="post" onsubmit="return confirmDelete()">
                        <input id="Page" name="p" type="hidden" value="<?= $page ?>">
                        <input id="StaffID" name="StaffID" type="hidden" value="<?= $row['StaffID'] ?>">
                        <input type="image" src="images/delete.png" title="Delete">
                    </form>
                </td>
            </tr>
<?php } ?>
    </tbody>
</table>
</div>

<!--PAGE-->
<?php
if (isset($_GET['Keyword']) || isset($_GET['StaffID']) || isset($_GET['Province'])) {
    $url = "index.php?r=StaffManage/view&Keyword={$_GET['Keyword']}&StaffID={$_GET['StaffID']}&Province={$_GET['Province']}&";
} else {
    $url = "index.php?r=StaffManage/view&";
}

GM::paging($url, $page, $maxPage);
?>

<!-- Modal -->
<div id="staffDetail" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="myModalLabel"><img src="images/001_54.png"> Staff Detail</h3>
    </div>
    <div class="modal-body">
        <table class="table table-bordered table-striped">
            <tr><th>Job Seeker ID</th><td id="cell-id"></td></tr>
            <tr><th>Name</th><td id="cell-staffname"></td></tr>
            <tr><th>Gender</th><td id="cell-gender"></td></tr>
            <tr><th>Nationality</th><td id="cell-nationality"></td></tr>
            <tr><th>Date of Birth</th><td id="cell-dob"></td></tr>
            <tr><th>Address</th><td id="cell-address"></td></tr>
            <tr><th>Email</th><td id="cell-email"></td></tr>
            <tr><th>Phone</th><td id="cell-phone"></td></tr>
            <tr><th>Mobile</th><td id="cell-mobile"></td></tr>
            <tr><th>Education</th><td id="cell-education"></td></tr>
            <tr><th>Institution</th><td id="cell-institution"></td></tr>
            <tr><th>Major</th><td id="cell-major"></td></tr>
            <tr><th>EN skill</th><td id="cell-enskill"></td></tr>
            <tr><th>JP skill</th><td id="cell-jpskill"></td></tr>
            <tr><th>Work position</th><td id="cell-workposition"></td></tr>
            <tr><th>Work experience detail</th><td id="cell-workexperiencedetail"></td></tr>
            <tr><th>Expect working position</th><td id="cell-expectworkingposition"></td></tr>
            <tr><th>Expect location name</th><td id="cell-expectlocationname"></td></tr>
            <tr><th>Expect salary</th><td id="cell-expectsalary"></td></tr>
            <tr><th>Note</th><td id="cell-note"></td></tr>
            <tr><th>Register page language</th><td id="cell-pagelanguage"></td></tr>
            <tr id="row-jobdetail"><th>Job</th><td id="cell-job">
                    <div class="accordion" id="accordion1">
                        <div class="accordion-group">
                            <div class="accordion-heading">
                                <a class="accordion-toggle" id="JobTitle" data-toggle="collapse" data-parent="#accordion1" href="#collapseOne">
                                    Job Position
                                </a>
                            </div>
                            <div id="collapseOne" class="accordion-body collapse">
                                <div class="accordion-inner" id="JobDetail">
                                    Detail
                                </div>
                            </div>
                        </div>
                    </div>
                </td></tr>
        </table>
    </div>
    <div class="modal-footer">
        <!--<button class="btn btn-primary">Save changes</button>-->
        <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div>

<script>
    $(function(){
        $('.tablestaff tbody').on('click', '.col-status img',function(){
            editStatus($(this));
        });
        $('.tablestaff tbody').on('click', '.col-detail img',function(){
            showDetail($(this));
        });
        
        // get value in form search
        $('#inputKeyword').val('<?= isset($_GET['Keyword']) ? $_GET['Keyword'] : '' ?>');
        $('#inputStaffID').val('<?= isset($_GET['StaffID']) ? $_GET['StaffID'] : '' ?>');
        $('#inputProvince').val('<?= isset($_GET['Province']) ? $_GET['Province'] : '' ?>');
        
        //fill '-' cell(td)empty
        $('td').each(function(){
            if($(this).html()==''){
                $(this).html('-');
            }
        });
        
        $('#btn-search').click(function(){
            document.getElementById("formSearch").submit();
        });
    });
    function editStatus(objJQ){
        var id = objJQ.parent().parent().attr('data-id');
        var status = objJQ.attr('data-status');
        $.post('index.php?r=StaffManage/Status', {
            StaffID: id,
            Status: (status == 'P')?'U':'P'
        }, function(data){
            if(data>0){
                if(status == 'P'){
                    objJQ.attr('src', 'images/disable.png');
                    objJQ.attr('data-status', 'U');
                } else {
                    objJQ.attr('src', 'images/accept.png');
                    objJQ.attr('data-status', 'P');
                }
            }
        }, 'text');
    }
    function showDetail(objJQ){
        var row = objJQ.parent().parent().parent();
        $('#cell-id').text(row.attr('data-id'));
        $('#cell-staffname').text(row.attr('data-staffname'));
        $('#cell-gender').text(row.attr('data-gender'));
        $('#cell-nationality').text(row.attr('data-nationality'));
        $('#cell-dob').text(row.attr('data-dob'));
        $('#cell-address').text(row.attr('data-address')+' '+row.attr('data-provinceName')+' '+row.attr('data-zipcode'));
        $('#cell-email').text(row.attr('data-email'));
        $('#cell-phone').text(row.attr('data-phone'));
        $('#cell-mobile').text(row.attr('data-mobile'));
        $('#cell-education').text(row.attr('data-education'));
        $('#cell-institution').text(row.attr('data-institution'));
        $('#cell-major').text(row.attr('data-major'));
        $('#cell-enskill').text(row.attr('data-enskill'));
        $('#cell-jpskill').text(row.attr('data-jpskill'));
        $('#cell-workposition').text(row.attr('data-workposition'));
        $('#cell-workexperiencedetail').text(row.attr('data-workexperiencedetail'));
        $('#cell-expectworkingposition').text(row.attr('data-expectworkingposition'));
        $('#cell-expectlocationname').text(row.attr('data-expectlocationname'));
        $('#cell-expectsalary').text(row.attr('data-expectsalary'));
        $('#cell-note').text(row.attr('data-note'));
        $('#cell-pagelanguage').text(row.attr('data-pagelanguage'));
        if(row.attr('data-jobid') == 0){
            $('#row-jobdetail').hide();
        } else {
            $('#row-jobdetail').show();
            
            $.post('index.php?r=StaffManage/GetDatailJob',{
                Lang: row.attr('data-pagelanguage'),
                JobID: row.attr('data-jobid')
            },
            function(data){
                $('#JobTitle').html(data.Position);
                $('#JobDetail').html(data.Descript);
            }, 'json');
        }
        
        $('td').each(function(){
            if($(this).html()==''){
                $(this).html('-');
            }
        });
    }
    function confirmDelete(){
        return confirm('ยืนยันการลบ')?true:false;
    }
</script>
<?php
//print_r($data['data']);
?>